<!-- 冲红开票详情 -->
<template>
	<div class="invoiceing-detail-dialog">
		<!-- 发票详情 -->
		<a-descriptions :column="3" class="ant-descriptions-blockquote">
			<template #title>
				发票详情

				<a-tag :color="statusList[props.invoiceDetails?.approvalStatus]?.color">
					{{ statusList[props.invoiceDetails?.approvalStatus]?.name }}
				</a-tag>
			</template>
			<a-descriptions-item label="发票类型">
				{{ invoiceKindOptions[props.invoiceDetails?.invoiceKind - 1] }}
			</a-descriptions-item>

			<a-descriptions-item label="抬头类型">{{ props.invoiceDetails?.buyerType === 1 ? '个人' : '企业' }}</a-descriptions-item>

			<a-descriptions-item label="发票抬头">{{ props.invoiceDetails?.buyerName }}</a-descriptions-item>

			<a-descriptions-item label="税号">{{ props.invoiceDetails?.buyerTaxpayerNum }}</a-descriptions-item>

			<a-descriptions-item label="注册地址" span="2">{{ props.invoiceDetails?.buyerAddress }}</a-descriptions-item>

			<a-descriptions-item label="注册电话">{{ props.invoiceDetails?.buyerTel }}</a-descriptions-item>

			<a-descriptions-item label="备注" span="3">{{ props.invoiceDetails?.remark }}</a-descriptions-item>
		</a-descriptions>

		<!-- 已通过的详情中展示发票列表 -->
		<a-typography-text strong>
			<blockquote
				v-if="
					!props?.isApproval &&
					![1, 2, 4, 5].includes(props.invoiceDetails?.approvalStatus) &&
					![2].includes(props.invoiceDetails?.status)
				">
				发票列表
			</blockquote>
		</a-typography-text>
		<vxe-grid
			ref="grid"
			v-if="
				!props?.isApproval &&
				![1, 2, 4, 5].includes(props.invoiceDetails?.approvalStatus) &&
				![2].includes(props.invoiceDetails?.status)
			"
			v-bind="gridOptions"
			:data="(invoiceList as Array<any>)"
			:loading="loadings.detail">
			<!-- :color="statusMap[status].color" -->
			<template #invoiceStatus="{row}">
				<a-tag :color="invoiceDetailsStatusList[row.status].color" style="min-width: 70px">
					{{ invoiceDetailsStatusList[row.status].name }}
				</a-tag>
			</template>

			<template #invoiceNumber="{row}">
				<span v-color="{color: COLOR_MAP.processing}">{{ row?.invoiceNo }}</span>
				<!-- 判断来源 -->
				<a
					v-show="row.status === 4 && props.invoiceDetails?.sourceType !== 1"
					@click="download(row)"
					:href="row.downloadUrl"
					download="发票">
					<download-outlined class="flush-red-icon" />
				</a>
			</template>

			<template #operation="{row}">
				<a @click="handler(row, 'invoiceDetail')">详情</a>
				<a-divider type="vertical" v-if="[2, 4].includes(row.status) && shouMore(row)" />
				<template v-if="[2, 4].includes(row.status)">
					<a-dropdown placement="bottom">
						<a class="ant-dropdown-link" @click.prevent v-if="shouMore(row)">
							更多
							<down-outlined />
						</a>
						<template #overlay>
							<a-menu class="default-menu-item">
								<!-- 开票成功操作按钮 普票：冲红 专票：填写冲红表 -->
								<a-menu-item
									v-if="
										props.invoiceDetails?.sourceType !== 1 &&
										row.status === 4 &&
										[0].includes(row.redStatus) &&
										hasPermissions(['mk_finance_invoicing_history_red_submit']) &&
										!props?.isApproval &&
										!showBtn(row)
									"
									@click="handler(row, 'redBlood')">
									{{ row.invoiceKind === 2 ? '填写冲红表' : '冲红' }}
								</a-menu-item>

								<a-menu-item
									v-if="
										props.invoiceDetails?.sourceType !== 1 &&
										row.invoiceKind !== 2 &&
										row.status === 4 &&
										[2].includes(row.redStatus) &&
										hasPermissions(['mk_finance_invoicing_history_red_submit']) &&
										!props?.isApproval
									"
									@click="handler(row, 'redBlood')">
									冲红
								</a-menu-item>

								<!-- 发票补录 sourceType === 1 -->
								<a-menu-item
									v-if="
										props.invoiceDetails?.sourceType === 1 &&
										row.status === 4 &&
										hasPermissions(['mk_finance_invoicing_history_red_additional_recording']) &&
										!props?.isApproval &&
										([2].includes(row.redStatus) || ([0].includes(row.redStatus) && !showBtn(row)))
									"
									@click="handler(row, 'recording')">
									冲红补录
								</a-menu-item>

								<a-menu-item
									v-if="
										props.invoiceDetails?.sourceType !== 1 &&
										row.invoiceKind === 2 &&
										row.status === 4 &&
										row.hasPassRedInfo === false &&
										row.hasPassRedInfo !== null &&
										hasPermissions(['mk_finance_invoicing_history_red_submit']) &&
										showBtn(row)
									"
									@click="handler(row, 'redBlood')">
									{{ '填写冲红表' }}
								</a-menu-item>

								<!-- 专票冲红失败 全电发票也需要 -->
								<a-menu-item
									v-if="
										props.invoiceDetails?.sourceType !== 1 &&
										row.invoiceKind === 1 &&
										row.status === 4 &&
										[2].includes(row.redStatus) &&
										hasPermissions(['mk_finance_invoicing_history_red_qrch']) &&
										!props?.isApproval &&
										!showBtn(row)
									"
									@click="handler(row, 'confirmFlushingRed')">
									确认冲红
								</a-menu-item>

								<!-- <a-menu-item v-if="row.status === 4 && !props?.isApproval" @click="handler(row, 'redBlood')">{{ row.invoiceKind === 1 ? '冲红' : '填写冲红表' }}</a-menu-item> -->

								<!-- <a-menu-item v-if="row.status === 2 && hasPermissions(['mk_finance_invoicing_history_cancel'])" @click="handler(row, 'cancel')">作废</a-menu-item>
								<a-menu-item v-if="row.status === 2 && hasPermissions(['mk_finance_invoicing_history_resubmit'])" @click="handler(row, 'resubmit')">重新提交</a-menu-item> -->

								<a-menu-item
									v-if="
										props.invoiceDetails?.sourceType !== 1 &&
										row.status == 2 &&
										row.invoiceType === 1 &&
										hasPermissions(['mk_finance_invoicing_history_revoke']) &&
										!props?.isApproval
									"
									@click="handler(row, 'revoke')">
									撤销
								</a-menu-item>
								<a-menu-item
									v-if="
										props.invoiceDetails?.sourceType !== 1 &&
										row.status == 2 &&
										row.invoiceKind === 1 &&
										!props?.isApproval
									"
									@click="handler(row, 'rePush')">
									重新推送
								</a-menu-item>
							</a-menu>
						</template>
					</a-dropdown>
				</template>
			</template>
		</vxe-grid>

		<br />

		<a-typography-text strong>
			<blockquote>缴费详情</blockquote>
		</a-typography-text>
		<div class="subject" v-color="{color: COLOR_MAP.primary}">开票主体：{{ props.invoiceDetails?.invOrgName }}</div>
		<vxe-grid ref="grid" v-bind="gridOptions2" :data="(billDetailInfoList as Array<any>)" :loading="loadings.detail">
			<template #money="{row}">
				<span v-text="row.feeDirection === 1 ? '+' : '-'" />
				{{ row.money }}
			</template>
			<template #bottom>
				<vxe-toolbar perfect>
					<template #buttons>
						<div class="table-bottom-class" v-for="(e, index) in bottomBtn" :key="index">
							{{ e.name }}:
							<span v-color="{color: COLOR_MAP.primary}">{{ e.money.toFixed(2) || 0 }}元</span>
						</div>
					</template>
				</vxe-toolbar>
			</template>
		</vxe-grid>
		<br />

		<!-- 收件人信息 -->
		<a-descriptions title="收件人信息" :column="3" class="ant-descriptions-blockquote">
			<a-descriptions-item label="姓名">{{ props.invoiceDetails?.takerName }}</a-descriptions-item>

			<a-descriptions-item label="手机号码">{{ props.invoiceDetails?.takerTel }}</a-descriptions-item>

			<a-descriptions-item label="邮箱地址">
				{{ props.invoiceDetails?.takerEmail }}
				<!-- 发票补录禁用 -->
				<a-button :disabled="props.invoiceDetails.sourceType === 1" size="small" type="link" @click="visibles.updateEmail = true">
					<FormOutlined />
				</a-button>
			</a-descriptions-item>
		</a-descriptions>

		<br />

		<!-- 合同信息 -->
		<a-descriptions title="合同信息" :column="3" class="ant-descriptions-blockquote">
			<a-descriptions-item label="合同类型">{{ contractData?.contractType === 1 ? '个人' : '企业' }}合同</a-descriptions-item>

			<!-- 租客合同 -->
			<template v-if="props.invoiceDetails?.contractId">
				<a-descriptions-item label="房源地址" span="3">
					<div>{{ contractData?.house?.address }}</div>
				</a-descriptions-item>
				<a-descriptions-item label="租客姓名">{{ contractData?.renterInfo?.name || '-' }}</a-descriptions-item>

				<a-descriptions-item label="电话">{{ contractData?.renterInfo?.phone || '-' }}</a-descriptions-item>

				<a-descriptions-item label="合同周期">
					{{ contractData?.beginTime || '-' }} 至 {{ contractData?.endTime || '-' }}
				</a-descriptions-item>

				<a-descriptions-item label="押金">{{ contractData?.deposit?.toFixed(2) }}元</a-descriptions-item>

				<a-descriptions-item label="租金">{{ contractData?.price?.toFixed(2) }}元/月</a-descriptions-item>
			</template>
			<!-- 包租合同 -->
			<template v-else>
				<a-descriptions-item label="企业名称" span="3">
					<div>{{ contractData?.enterPriseDTO?.enterPriseName }}</div>
				</a-descriptions-item>
				<a-descriptions-item label="联系人">{{ contractData?.renterInfoDTO?.name || '-' }}</a-descriptions-item>

				<a-descriptions-item label="联系人手机号">{{ contractData?.renterInfoDTO?.phone || '-' }}</a-descriptions-item>

				<a-descriptions-item label="合同周期">
					{{ contractData?.beginTime || '-' }} 至 {{ contractData?.endTime || '-' }}
				</a-descriptions-item>

				<a-descriptions-item label="承租总价">
					{{ contractData?.deposit?.toFixed(2) }}元/月(共{{ contractData?.houseRoomDTOList?.length }}间)
				</a-descriptions-item>

				<a-descriptions-item label="押金总价">{{ contractData?.price?.toFixed(2) }}元</a-descriptions-item>
			</template>

			<a-descriptions-item label="付款方式">
				<span>押{{ contractData?.depositMonth }}</span>
				<span v-if="contractData?.periodMonth === 99">一次性付</span>
				<span v-else>付{{ contractData?.periodMonth }}</span>
			</a-descriptions-item>
		</a-descriptions>

		<!-- 开票信息 -->
		<a-descriptions title="开票信息" :column="3" class="ant-descriptions-blockquote">
			<a-descriptions-item label="开票来源">{{ sourceType[props.invoiceDetails?.sourceType || 0] }}</a-descriptions-item>

			<a-descriptions-item label="提交人">{{ props.invoiceDetails?.createrName }}</a-descriptions-item>
			<a-descriptions-item label="提交时间">{{ props.invoiceDetails?.createTime }}</a-descriptions-item>
		</a-descriptions>
	</div>

	<update-email-address
		:id="props?.invoiceDetails?.id"
		:email="props.invoiceDetails?.takerEmail"
		v-model:visible="visibles.updateEmail"
		@close="visibles.updateEmail = false"
		@success="emits('close')"></update-email-address>

	<!-- 冲红---重新提交 and 补录 -->
	<apply-flush-red
		v-model:visible="visibles.redBlood"
		:invoiceKind="props?.invoiceDetails?.invoiceKind"
		:resubmitId="resubmitId"
		:isRecording="isRecording"
		@close="visibles.redBlood = false"
		:id="invoiceId"
		@success="emits('close')"></apply-flush-red>

	<!-- 撤销冲红 -->
	<invoice-revoke-flushing
		v-model:visible="visibles.revokeFlushing"
		@close="visibles.revokeFlushing = false"
		:id="invoiceId"
		@success="emits('close')"></invoice-revoke-flushing>

	<!-- 重新推送 -->
	<invoice-void-push
		v-model:visible="visibles.rePush"
		@close="visibles.rePush = false"
		:invoiceType="invoiceType"
		:id="invoiceId"
		@success="emits('close')"></invoice-void-push>

	<!-- 详情 -->
	<flush-red-invoceing-detail-modal
		v-model:visible="visibles.invoiceDetail"
		:detailedData="detailedData"
		:id="props?.invoiceDetails?.id"></flush-red-invoceing-detail-modal>

	<!--发票重新提交 -->
	<apply-invoice-dialog v-model:visible="visibles.resubmit" :resubmitId="resubmitId" :id="invoiceId" @success="emits('close')" />

	<!-- 发票作废 -->
	<invoice-void-cancel
		v-model:visible="visibles.cancel"
		:id="invoiceId"
		@success="emits('close')"
		@close="visibles.cancel = false"></invoice-void-cancel>

	<!-- 发票撤销 -->
	<invoice-void-revoke
		v-model:visible="visibles.revoke"
		:id="invoiceId"
		@success="emits('close')"
		@close="visibles.revoke = false"></invoice-void-revoke>
</template>

<script lang="ts" setup>
	import {reactive, ref, toRef, watchEffect, watch} from 'vue'
	import {VxeGridInstance, VxeGridProps} from 'vxe-table'
	import {FormInstance, message} from 'ant-design-vue'
	import {formatDate} from 'yuxin-base/src/utils/date'
	import {COLOR_MAP} from 'yuxin-base/src/constant'
	import {DownloadOutlined, ExclamationCircleFilled, FormOutlined, DownOutlined} from '@ant-design/icons-vue'
	import {getInvoiceDetails, confirmFlushing} from '@/api/invoicing-history'
	import {getRenterContractDetail} from '@/api/contract'
	import {statusList, multiplicationList} from '@/utils/billing-history-status'
	import {financeBillFlowAudit, getFinanceBillFlowDetail} from '@/api/details'
	import ApprovalInformation from '@/components/common/approval-information.vue'
	import InvoiceDetail from '@/pages/finance/invoice-administration/billing-history/invoice-detail.vue'
	import UpdateEmailAddress from '@/components/finance/dialog/update-email-address.vue'
	import {invoiceStatusList, invoiceDetailsStatusList} from '@/utils/billing-history-status'
	import ApplyFlushRed from '@/components/finance/invoice-administration/billing-history/apply-flush-red.vue'
	import FlushRedInvoceingDetailModal from '@/components/finance/invoice-administration/billing-history/flush-red-invoceing-detail-modal.vue'
	import InvoiceVoidPush from '@/components/finance/invoice-administration/billing-history/invoice-void-push.vue'
	import InvoiceRevokeFlushing from '@/components/finance/invoice-administration/billing-history/invoice-revoke-flushing.vue'
	import ApplyInvoiceDialog from '@/components/contract/invoice/apply-invoice.vue'
	import {useStore} from '@/store/index'
	import InvoiceVoidRevoke from '@/components/finance/invoice-administration/billing-history/invoice-void-revoke.vue'
	import {getEnterContractDetails} from '@/api/charter-contract'

	const hasPermissions = useStore().hasPermissions

	const props = defineProps<{
		id?: string
		processInstanceId?: string
		visible?: boolean
		invoiceDetails?: any
		isApproval?: boolean
	}>()
	const emits = defineEmits(['close'])

	const loadings = reactive({
		audit: false,
		detail: false
	})

	const invoiceType = ref(1)

	const bottomBtn = reactive([
		{
			name: '价税合计',
			money: 0
		},
		{
			name: '税额合计',
			money: 0
		},
		{
			name: '税后合计',
			money: 0
		}
	])

	const invoiceKindOptions = [
		'增值税电子普通发票',
		'增值税电子专用发票',
		'电子发票（普通发票）',
		'电子发票（增值税专用发票）',
		'增值税普通发票',
		'增值税专用发票'
	]
	const sourceType = ['pms', '第三方录入', '租客端']
	const contractData = ref<any>({})

	const invoiceId = ref('')

	const detailedData = ref<any>({})

	const visibles = reactive<any>({
		search: false,
		invoiceDetail: false,
		// 冲红
		redBlood: false,
		//开票详情
		invoiceingDetail: false,

		// 开票重新提交
		resubmit: false,
		cancel: false,
		// 发票撤销
		revoke: false,
		// 确认冲红
		confirmFlushingRed: false
	})

	const invoiceList = ref([])

	const billDetailInfoList = ref([])

	const grid = ref<VxeGridInstance>()

	const resubmitId = ref('')

	/** 是否补录 */
	const isRecording = ref(false)

	const gridOptions = reactive<VxeGridProps>({
		size: 'small',
		maxHeight: 300,
		// height: '400',
		showOverflow: true,
		border: true,
		rowConfig: {
			isHover: true
		},
		columns: [
			{
				// field: 'invoiceStatus',
				title: '发票状态',
				align: 'center',
				slots: {
					default: 'invoiceStatus'
				}
				// minWidth: 200
			},
			{
				title: '发票号码',
				// minWidth: 150,
				align: 'center',
				slots: {
					default: 'invoiceNumber'
				}
			},
			{
				title: '发票类型',
				align: 'center',
				field: 'invoiceKind',
				formatter({row}) {
					return invoiceKindOptions[row.invoiceKind - 1]
				}
			},
			{
				title: '开票金额(元)',
				// minWidth: 150,
				align: 'center',
				field: 'price',
				formatter({row}) {
					return row?.price ? row?.price.toFixed(2) : 0
				}
			},
			{
				title: '不成功原因',
				// minWidth: 350,
				align: 'center',
				field: 'failureReason',
				formatter({row}) {
					if (row.status === 2) {
						if ([1, 2].includes(row.invoiceKind))
							return '可能存在设备离线，或者发票库存不足，核验设备及发票库存状况之后，可以重新推送发票信息，或撤销重新申请。'

						if ([3, 4].includes(row.invoiceKind))
							return '开票异常，建议重新推送发票信息，或撤销重新申请;如果仍未解决，请联系运维人员。'
					} else if (row.status === 3) {
						return '开票已撤销'
					} else {
						return row.failureReason
					}
				}
			},
			{
				title: '操作',
				// width: 120,
				align: 'center',
				slots: {
					default: 'operation'
				}
			}
		]
	})

	const gridOptions2 = reactive<VxeGridProps>({
		// height: '400',
		size: 'small',
		maxHeight: 300,
		border: true,
		showOverflow: true,
		rowConfig: {
			isHover: true
		},
		columns: [
			{
				field: 'period',
				title: '期数',
				width: 80,
				align: 'center',
				formatter({row}) {
					return row.period ? '第' + row?.period + '期' : '-'
				}
			},
			{
				title: '费用类型',
				width: 100,
				field: 'feeSubjectName'
			},
			{
				title: '本次开票金额(元)',
				width: 140,
				// field: 'price',
				formatter({row}) {
					return row.price?.toFixed(2)
				}
			},
			{
				title: '开票税率',
				minWidth: 80,
				field: 'taxRate',
				formatter({row}) {
					return row.taxRate ? row?.taxRate * 100 + '%' : '-'
				}
			},
			{
				title: '开票税额(元)',
				minWidth: 100,
				// field: 'taxPrice',
				formatter({row}) {
					return row.taxPrice?.toFixed(2)
				}
			},
			{
				title: '开票税后金额(元)',
				minWidth: 150,
				// field: 'afterTaxPrice',
				formatter({row}) {
					return row?.afterTaxPrice?.toFixed(2)
				}
			},
			{
				title: '优惠政策',
				minWidth: 150,
				// field: 'preferentialPolicyType',
				formatter({row}) {
					// 优惠政策标识【0不使用，1：免税 2不征税】
					return row?.preferentialPolicyType === 0 ? '无优惠' : `${row?.preferentialPolicyType === 1 ? '免税' : '不征税'}`
				}
			},
			// {
			// 	title: '已开票金额(元)',
			// 	minWidth: 150,
			// 	align: 'center',
			// 	slots: {
			// 		default: 'money'
			// 	}
			// },
			{
				title: '费用周期',
				minWidth: 200,
				formatter({row}) {
					return formatDate(row.beginTime) + ' 至 ' + formatDate(row.endTime)
				}
			},
			{
				title: '应收日期',
				width: 150,
				field: 'predictTime'
			},
			{
				title: '应收(元)',
				minWidth: 150,
				field: 'originalMoney',
				formatter({row}) {
					return row?.originalMoney ? row?.originalMoney.toFixed(2) : 0
				}
			},
			{
				title: '已收时间',
				minWidth: 100,
				fixed: 'right',
				field: 'practicalTime'
			},
			{
				title: '已收(元)',
				minWidth: 100,
				fixed: 'right',
				field: 'occurredMoney',
				formatter({row}) {
					return row?.occurredMoney ? row?.occurredMoney.toFixed(2) : 0
				}
			},

			{
				title: '待收(元)',
				minWidth: 100,
				fixed: 'right',
				field: 'notOccurredMoney',
				formatter({row}) {
					return row?.notOccurredMoney ? row?.notOccurredMoney.toFixed(2) : 0
				}
			}
		]
	})

	const handler = (row: any, type: string) => {
		resubmitId.value = ''
		invoiceType.value = row.invoiceType
		if (type === 'redBlood') {
		} else if (type == 'invoiceDetail') {
			getInvoiceDetailsF(row.id)
		} else if (type === 'resubmit') {
			resubmitId.value = row.id
		} else if (type === 'confirmFlushingRed') {
			confirmFlushingRedF(row.id)
		}

		// 冲红补录
		if (type === 'recording') {
			isRecording.value = true
			type = 'redBlood'
		}

		invoiceId.value = row.id
		visibles[type] = true
	}
	const getRenterContractDetailF = () => {
		if (props.invoiceDetails?.contractId) {
			getRenterContractDetail(props.invoiceDetails?.contractId).then((res: any) => {
				contractData.value = res.data
			})
		} else if (props.invoiceDetails?.enterContractId) {
			getEnterContractDetails(props.invoiceDetails?.enterContractId).then((res: any) => {
				contractData.value = res.data
			})
		}
	}

	const getInvoiceDetailsF = (id: string) => {
		getInvoiceDetails(id).then((res: any) => {
			detailedData.value = res.data
		})
	}

	const download = (row: any) => {}

	watchEffect(() => {
		// invoiceType 根据 发票类型不同使用不同字段
		invoiceList.value =
			props.invoiceDetails?.invoiceType === 1 ? props.invoiceDetails?.invoiceInfos : props.invoiceDetails?.sourceInvoiceInfos || []
		console.log(props.invoiceDetails?.detailItems, 'props.invoiceDetails?.detailItems')
		billDetailInfoList.value = props.invoiceDetails?.detailItems || []
		getRenterContractDetailF()

		if (props.invoiceDetails?.detailItems && props.invoiceDetails?.detailItems.length) {
			props.invoiceDetails?.detailItems.forEach((e: any) => {
				bottomBtn[0].money += e?.price
				bottomBtn[1].money += e?.taxPrice
				bottomBtn[2].money += e?.afterTaxPrice
			})
		}
	})

	// 确认冲红
	const confirmFlushingRedF = (id: string) => {
		confirmFlushing({
			invoiceInfoId: id
		}).then(() => {
			message.success('操作成功')
		})
	}

	//专票冲红失败展示 确认冲红  红字信息表审核失败 展示填写冲红表
	const showBtn = (row: any) => {
		let temp = false
		if (row.hasPassRedInfo === false && row.hasPassRedInfo !== null) {
			temp = true
		}
		return temp
	}

	/** 是否展示更多 */
	const shouMore = (row: any) => {
		let temp =
			row.status === 4 &&
			[0].includes(row.redStatus) &&
			hasPermissions(['mk_finance_invoicing_history_red_submit']) &&
			!props?.isApproval &&
			!showBtn(row)
		let temp2 =
			row.invoiceKind === 1 &&
			row.status === 4 &&
			[2].includes(row.redStatus) &&
			hasPermissions(['mk_finance_invoicing_history_red_submit']) &&
			!props?.isApproval
		let temp3 =
			row.invoiceKind !== 1 &&
			row.status === 4 &&
			row.hasPassRedInfo === false &&
			row.hasPassRedInfo !== null &&
			hasPermissions(['mk_finance_invoicing_history_red_submit']) &&
			showBtn(row)
		let temp4 =
			row.invoiceKind !== 1 &&
			row.status === 4 &&
			[2].includes(row.redStatus) &&
			hasPermissions(['mk_finance_invoicing_history_red_qrch']) &&
			!props?.isApproval &&
			!showBtn(row)
		let temp5 =
			row.status == 2 && row.invoiceType === 1 && hasPermissions(['mk_finance_invoicing_history_revoke']) && !props?.isApproval
		let temp6 = row.status == 2 && row.invoiceKind === 1 && !props?.isApproval

		return temp || temp2 || temp3 || temp4 || temp5 || temp6
	}
</script>

<style lang="less" scoped>
	.invoiceing-detail-dialog {
		.contract-information-left {
			min-height: 100%;
			padding-right: 15px;
			border-right: 1px solid @border-color-light;
		}

		.approval-process-list-right {
			min-height: 100%;
			padding-left: 15px;
		}

		.ant-modal-body {
			overflow: auto;
			min-height: 600px;
			max-height: 900px;
			height: calc(100vh - 150px);
		}

		.ant-descriptions-item-content {
			padding-right: 20px;
		}

		.ant-form-item {
			width: 100%;
			margin: 0;
		}

		.subject {
			width: 100%;
			height: 48px;
			background: #e1edff;
			border-radius: 0px 0px 0px 0px;
			// opacity: 0.12;
			font-size: 14px;
			font-family: Source Han Sans CN-Medium, Source Han Sans CN;
			font-weight: 500;
			// color: #0266ff;
			line-height: 48px;
			text-align: center;
		}

		.table-bottom-class {
			margin-left: 20px;
		}
		.flush-red-icon {
			cursor: pointer;
			color: #0266ff;
			margin-left: 5px;
		}
	}
</style>
